<template>
    <div class="lua-status-bar">
        <div class="status-left">
            <span class="status-item">
                <a-icon type="file-text" />
                {{ fileName || '未命名文件' }}
            </span>
            <span v-if="isModified" class="status-item">
                <a-icon type="edit" style="color: #faad14;" />
                已修改
            </span>
        </div>
    
        <div class="status-center">
            <span v-if="lastSaved" class="status-item">
                <a-icon type="clock-circle" />
                最后保存: {{ formatTime(lastSaved) }}
            </span>
        </div>
    
        <div class="status-right">
            <span class="status-item">
                <a-icon type="environment" />
                行 {{ currentLine }}, 列 {{ currentColumn }}
            </span>
            <span class="status-item">
                <a-icon type="file" />
                {{ totalLines }} 行
            </span>
            <span class="status-item">
                <a-icon type="font-size" />
                {{ fontSize }}px
            </span>
            <span class="status-item">
                Lua
            </span>
        </div>
    </div>
</template>

<script>
export default {
    name: 'LuaStatusBar',
    props: {
        fileName: {
            type: String,
            default: ''
        },
        isModified: {
            type: Boolean,
            default: false
        },
        lastSaved: {
            type: Date,
            default: null
        },
        currentLine: {
            type: Number,
            default: 1
        },
        currentColumn: {
            type: Number,
            default: 1
        },
        totalLines: {
            type: Number,
            default: 1
        },
        fontSize: {
            type: Number,
            default: 14
        }
    },
    methods: {
        formatTime(date) {
            if (!date) return ''
            return date.toLocaleTimeString('zh-CN', {
                hour: '2-digit',
                minute: '2-digit',
                second: '2-digit'
            })
        }
    }
}
</script>

<style scoped>
.lua-status-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 16px;
    background: #f0f0f0;
    border-top: 1px solid #e8e8e8;
    font-size: 12px;
    color: #666;
    height: 28px;
    flex-shrink: 0; /* 防止在flex布局中被压缩 */
}
.status-left,
.status-center,
.status-right {
    display: flex;
    align-items: center;
}
.status-item {
    display: flex;
    align-items: center;
    margin-right: 16px;
}
.status-item:last-child {
    margin-right: 0;
}
.status-item .anticon {
    margin-right: 4px;
    font-size: 12px;
}
</style>